<template>
    <div class="pager-box">
        <el-pagination
            :page-sizes="[10, 15, 20]"
            :current-page="page.pageNo"
            :page-size="page.pageSize"
            layout="total,sizes,prev,pager,next,jumper"
            :total="page.totalCount"
            style="margin-top: 10px;"
            @current-change="currentChange"
            @size-change="sizeChange"
        />
    </div>
</template>

<script>
export default {
    name: 'Index',
    props: {
        page: {
            type: Object,
            default: () => ({ pageNo: 0, pageSize: 1, totalCount: 10 })
        }
    },
    methods: {
        currentChange(val) {
            this.$emit('current-change', val)
        },
        sizeChange(size) {
            this.$emit('size-change', size)
        }
    }
}
</script>
